<template>
	<div id="getGuest" class="wrap_common">
		<div class="wrap_tit_top">
			<!-- 店铺预览 -->
			<div class="home_preview">
				<div class="home_btn_block" @click="jumpOtherUser(userInfo.user_id, userInfo.role_id)">
					<div class="home_btn_left">
						<img class="home_user_attr" :src="`${userInfo.user_picture}?x-oss-process=image/resize,m_fill,h_120,w_120`" alt mode="aspectFill" />
						<span class="home_user_name">{{ userInfo.nick_name }}</span>
					</div>
					<div class="home_btn_right" v-if="$util.shieldReview()">
						<!-- <span>店铺预览</span>
						<i class="iconfont iconjiantou" /> -->
						<img :src="`${constant.imgUrl + 'getguest/shop-promote.png'}?x-oss-process=image/resize,m_fill,h_111,w_279`" alt="" mode="widthFix" />
					</div>
				</div>
				<div class="remind_block" v-if="toolInfo.remind.un_read_num || toolInfo.helper.task_num">
					<img :src="constant.imgUrl + 'getguest/remind.png'" alt mode="widthFix" />
				</div>
				<!--  -->
				<div class="remind_list" @click="toolInfoFn(1)" v-if="toolInfo.remind.un_read_num">
					<div class="remind_list_left">
						<img :src="constant.imgUrl + 'getguest/remind_icon_1.png'" alt mode="widthFix" />
						<span>{{ toolInfo.remind.un_read_phone[0] }}向您提交了预约单</span>
					</div>
					<div class="remind_list_right">
						<span>未读</span>
						<span class="message_num">{{ toolInfo.remind.un_read_num }}</span>
						<i class="iconfont iconjiantou" />
					</div>
				</div>
				<div class="remind_list" @click="toolInfoFn(2)" v-if="toolInfo.helper.task_num">
					<div class="remind_list_left">
						<img :src="constant.imgUrl + 'getguest/remind_icon_2.png'" alt mode="widthFix" />
						<span>您有新的任务</span>
					</div>
					<div class="remind_list_right">
						<span>未读</span>
						<span class="message_num">{{ toolInfo.helper.task_num }}</span>
						<i class="iconfont iconjiantou" />
					</div>
				</div>
			</div>
			<!-- 按钮块 -->
			<div class="menu_btn_wrap" v-if="$util.shieldReview()">
				<div class="menu_title">获客工具</div>
				<div class="menu_list_blo">
					<div class="menu_list" v-for="(item, index) in menuData" :key="index" v-show="item.judge()" @click="jumpMenuFn(item)">
						<div class="menu_list_img">
							<img :src="constant.imgUrl + item.img" alt mode="widthFix" />
						</div>
						<div class="menu_txt">{{ item.name }}</div>
					</div>
				</div>
			</div>
			<div class="menu_btn_wrap" v-if="$util.shieldReview()">
				<div class="menu_title">营销工具</div>
				<div class="menu_list_blo">
					<!-- <div class="menu_list" v-if="item.judge ? item.judge() : true" v-for="(item, index) in marketDate" :key="item.id" @click="jumpMenuFn(item)"> -->
					<div class="menu_list" v-for="(item, index) in marketDate" :key="index" @click="jumpMenuFn(item)">
						<div class="menu_list_img">
							<img :src="constant.imgUrl + item.img" alt mode="widthFix" />
						</div>
						<div class="menu_txt">{{ item.name }}</div>
					</div>
				</div>
			</div>
			<!-- 推广助手 -->
			<div class="assistant_wrap" v-if="$util.shieldReview()">
				<div class="assistant_title">推广助手</div>
				<div class="assistant_blo">
					<div class="assistant_blo_left">
						<div class="qrCode_blo" @click="showStoreQrCode">
							<img :src="storeQrCode" class="qrCode_img" mode="widthFix" alt />
							<!-- #ifdef H5 -->
							<!-- #endif -->
							<!-- #ifdef MP-WEIXIN -->
							<!-- <img v-if="storeQrCode" :src="storeQrCode" alt class="qrCode_img" mode="widthFix" />
							<canvas v-else class="canvas" style="width: 100px; height: 100px;" canvasId="guestCodeId"></canvas> -->
							<!-- #endif -->
						</div>
						<div class="qrCode_link" @click="showStoreQrCode">
							<span>推广码</span>
							<i class="iconfont iconjiantou" />
						</div>
					</div>
					<div class="assistant_blo_right">
						<div class="assistant_btn_blo" v-for="(item, index) in promotionData" :key="index" @click="jumpMenuFn(item)">
							<div class="assistant_btn_left">
								<div class="assistant_btn_tit">{{ item.name }}</div>
								<div>{{ item.text }}</div>
							</div>
							<div class="assistant_btn_right">
								<img :src="constant.imgUrl + item.img" alt mode="widthFix" />
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- 数据统计 -->
			<div class="statistics_wrap">
				<div class="assistant_title">
					<div>数据统计</div>
					<div class="assistant_title_right">
						<div class="tit_list" v-if="userInfo ? (userInfo.role_id == 1 || userInfo.role_id == 2) : true" @click="toPageUrlFn('/pages/getGuest/statistics')">
							<img :src="constant.imgUrl + 'getguest/statistics_tit_1.png'" alt mode="widthFix" />
							<div>BOSS看板</div>
						</div>
						<div class="tit_list" v-if="userInfo ? (userInfo.role_id > 2 && userInfo.boss_user_id) : true" @click="toPageUrlFn('/pages/admin/staffManage/memberRanking')">
							<img :src="constant.imgUrl + 'getguest/statistics_tit_2.png'" alt mode="widthFix" />
							<div>员工排行</div>
						</div>
					</div>
				</div>
				<div class="statistics_blo">
					<div class="member_data">
						<span class="member_data_tit">客户数据</span>
						<span>
							24小时内总计有
							<span class="text_main_color">{{ memberDataToday || 0 }}&nbsp;</span>位客户进店
						</span>
					</div>
					<div @click="memberDetBtn">
						<span>详情</span>
						<i class="iconfont iconjiantou" />
					</div>
				</div>
				<div class="statistics_total">
					<div class="statistics_list" v-for="(item, index) in memberData" :key="index" @click="jumpMenuFn(item)">
						<div class="statistics_num" :class="{ 'text_main_color' : item.url }">
							<!-- <CountTo class="strong_text" :start-val="0" :end-val="item.data.now" :duration="2000" /> -->
							<span>{{ item.data.now }}</span>
							<span v-if="item.url" style="font-size: 12px">人</span>
						</div>
						<div>
							<span>{{ item.text }}</span>
							<i v-if="item.url" class="iconfont iconjiantou" />
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- div class="com_title">最近更新</!-->
		<footer class="main-footer">
			<v-defooter ref="defooters" :activeIndex="1" />
		</footer>
		<v-sharePoster ref="sharePoster" :type="btnType" />
		<app-store-qrCode ref="appStoreQrCode" :qrCode="storeQrCode" />
		<guide v-if="userInfo && userInfo.role_id != 2 && $util.shieldReview()" :user-info="userInfo" />
        <input-company ref="inputCompany" @updateUserInfo="updateUserInfo"/>
	</div>
</template>
<script>
import { mapGetters, mapState } from 'vuex'
// import CountTo from 'vue-count-to'
// import vueSeamless from 'vue-seamless-scroll'
import Defooter from '@/pages/components/deFooter'
import SharePoster from '@/pages/components/sharePoster'
import AppUserAttr from '@/pages/components/appUserAttr'
import AppStoreQrCode from '@/pages/components/dialog/appStoreQrCode'
import inputCompany from '@/pages/components/dialog/inputCompany'
import { jumpShop, getTimestamp, jumpOtherUser, verifiPhone } from '@/utils/common'
import { getUser } from '@/utils/auth'
import Guide from '@/pages/components/guide'
import qs from 'qs'
// api
import { getUserAnalysisData, getNewestData, getToolInfo, updateToolInfo } from '@/api/getGuest'
import { getStatsReport } from '@/api/center'
import { getWxQrCode } from '@/api/common'

export default {
	name: 'GetGuest',
	components: {
		'v-defooter': Defooter,
		'v-sharePoster': SharePoster,
		AppUserAttr,
		// CountTo,
		// vueSeamless,
		AppStoreQrCode,
		Guide,
		inputCompany
	},
	data() {
		return {
			constant: this.$constant,
			jumpOtherUser: jumpOtherUser,
			storeQrCode: '',
			minAppIndexUrl: '',
			// 线索
			statsReport: [],
			menuData: [
				{
					name: '获客商品',
					img: 'getguest/menu_icon_10.png',
					url: '/pages/admin/manage/shopManage',
					judge: () => {
						return this.userInfo ? this.userInfo.role_id == 2 : true
					}
				},
				{
					name: '获客案例',
					img: 'getguest/menu_icon_1.png',
					url: '/pages/getGuest/winCase',
					judge: () => true
				},
				{
					name: '获客文章',
					img: 'getguest/menu_icon_2.png',
					url: '/pages/getGuest/winArticle',
					judge: () => true
				},
				{
					name: '获客海报',
					img: 'getguest/menu_icon_3.png',
					url: '/pages/getGuest/winPoster',
					judge: () => true
				},
				{
					name: '家居风水',
					img: 'getguest/menu_icon_15.png',
					url: '/pages/pagesHome/shop/ShopDivination',
					judge: () => {
						return this.userInfo ? this.userInfo.role_id != 2 : true
					}
				},
				/* {
					name: '获客首页',
					img: 'getguest/menu_icon_12.png',
					funtion: () => {
						jumpOtherUser(this.userInfo.user_id, this.userInfo.role_id)
					},
					judge: () => true
				},*/
				{
					name: '项目管理',
					img: 'getguest/menu_icon_19.png',
					url: '/pages/constructionSite/list',
					judge: () => {
						return this.userInfo ? this.userInfo.role_id != 2 : true
					}
				},
				/* {
					name: '免费设计',
					img: 'getguest/menu_icon_13.png',
					url: '/pages/pagesHome/active/houseDesign',
					judge: () => {
						return this.userInfo ? this.userInfo.role_id != 2 : true
					}
				},
				{
					name: '报价工具',
					img: 'getguest/menu_icon_14.png',
					url: '/pages/pagesHome/thematicmo/inteoffer',
					judge: () => {
						return this.userInfo ? this.userInfo.role_id != 2 : true
					}
				},*/
				{
					name: '电子名片',
					img: 'getguest/menu_icon_16.png',
					funtion: () => {
						this.btnType = this.userInfo.role_id > 2 ? 5 : this.userInfo.role_id == 2 ? 8 : 1
						setTimeout(() => {
							this.$refs.sharePoster.showMask('', true)
						}, 100)
					},
					judge: () => true
				}
			],
			// 营销工具
			marketDate: [
				{
					name: '线上活动',
					img: 'getguest/menu_icon_17.png',
					url: '/pages/marketing/deactive'
				},
				{
					name: '报名礼包',
					img: 'getguest/menu_icon_18.png',
					url: '/pages/marketing/dejoin'
				},
				/* {
					name: '中装严选',
					img: 'getguest/menu_icon_20.png',
					funtion: () => {
						uni.navigateToMiniProgram({
							appId: 'wx98d747ea724d1f6a',
							extraData: this.constant
						})
					}
				}*/
			],
			// 推广按钮
			promotionData: [
				{
					name: '任务中心',
					img: 'getguest/promotion_icon_1.png',
					text: '',
					url: '/pages/getGuest/myTask'
				},
				{
					name: '邀请好友',
					img: 'getguest/promotion_icon_2.png',
					// text: '立得佣金',
					funtion: () => {
						if (this.constant.oemSource == 4) {
							if (this.userInfo.vip_level > 0) {
								let url = '/pages/getGuest/inviteShopHKDS'
								this.promotionData[1].url = url
							} else {
								uni.showToast({
									title: 'VIP用户专享功能',
									icon: 'none'
								})
								return false
							}
						} else {
							let url = '/pages/getGuest/inviteShop'
							this.promotionData[1].url = url
						}

						// if (this.userInfo.vip_level > 0) {
						// 	let url = this.constant.oemSource == 4 ? '/pages/getGuest/inviteShopHKDS' : '/pages/getGuest/inviteShop'
						// 	this.promotionData[1].url = url
						// } else {
						// 	uni.showToast({
						// 		title: 'VIP用户专享功能',
						// 		icon: 'none'
						// 	})
						// 	return false
						// }
					}
				},
				{
					name: '推广记录',
					img: 'getguest/promotion_icon_3.png',
					text: '',
					url: '/pages/getGuest/extensionRcord'
				},
				{
					name: '我的团队',
					img: 'getguest/promotion_icon_4.png',
					text: '',
					url: '/pages/getGuest/lowerMember'
				}
			],
			memberDataToday: 0,
			memberData: [
				{
					text: '今日获客',
					data: {
						now: 0
					}
				},
				{
					text: '累计获客',
					data: {
						now: 0
					},
					url: '/pages/order/subscribeOrder'
				},
				{
					text: '今日访问',
					data: {
						now: 0
					}
				},
				{
					text: '累计访问',
					data: {
						now: 0
					}
				}
			],
			btnType: null,
			articleData: '',
			caseData: '',
			posterData: '',
			toolInfo: {
				helper: '',
				remind: ''
			}
		}
	},
	computed: {
		...mapGetters({ userInfo: 'getUser' })
	},
	onLoad(options) {
		if (options.owner_user_id) {
			this.owner_user_id = options.owner_user_id
		}
		// let token = uni.getStorageSync('token')
		// if (token) {
		// 	uni.showLoading({
		// 		title: '加载中...'
		// 	})
		getUser().then(res => {
			const { role_id, nick_name } = this.userInfo
			if ((role_id == 1 || role_id == 2) && (!nick_name || verifiPhone(nick_name))) {
				this.$refs.inputCompany.openPopup()
			}
			let url = role_id == 1 ? '/pages/design/designCompany/indexNew' : role_id == 2 ? '/pages/design/material/index' : '/pages/design/designerIndex'
			this.minAppIndexUrl = url + `?owner_user_id=${this.userInfo.user_id}`

			if (this.userInfo.role_id == 2) {
				this.menuData[4].name = '店铺首页'
			}

			this.init()
			this._getNewestData()
			// uni.hideLoading()
		})
		// }
	},
	onPullDownRefresh() {
		this._getAnalysisData()
		this._getToolInfo().then(() => {
			uni.stopPullDownRefresh()
		})
	},
	// onShow() {
	// 	this._getAnalysisData()
	// 	this._getToolInfo().then(() => {
	// 		uni.stopPullDownRefresh()
	// 	})
	// },
	// created() {
	// 	getUser().then(res => {
	// 		this.init()
	// 		this._getNewestData()
	// 	})
	// },
	methods: {
		init() {
			this._getAnalysisData()
			this._getToolInfo()
			this._getWxQrCode()
			// #ifdef H5
			// this.$refs.appStoreQrCode.generateQRcode({ width: 100, margin: 4 }).then(res => {
			// 	this.storeQrCode = res
			// })
			// #endif
			// #ifdef MP-WEIXIN
			// this.$refs.appStoreQrCode.wxGenerateQRcode({ width: 100, _this: this, canvasId: 'guestCodeId', callback: (res) => {
			// 	this.storeQrCode = res
			// } })
			// #endif
			// this._getStatsReport()
		},
		// 获取微信小程序码
		_getWxQrCode() {
			getWxQrCode({ redirect_page: this.minAppIndexUrl }).then(res => {
				console.log('res', res.data.img_url)
				this.storeQrCode = res.data.img_url
			})
		},
		// 获客工具
		async _getToolInfo() {
			await getToolInfo().then(res => {
				if (res.status == 'success') {
					const data = res.data
					this.toolInfo = data
					this.promotionData[0].text = !data.helper.task_num ? '' : `共${data.helper.task_num}个`
					this.promotionData[2].text = !data.helper.record_num ? '' : `共${data.helper.record_num}个`
					this.promotionData[3].text = !data.helper.xj_user_num ? '' : `共${data.helper.xj_user_num}个`
				} else {
					uni.showToast(res.message)
				}
			})
		},
		// 客户数据
		_getAnalysisData() {
			getUserAnalysisData().then(res => {
				if (res.status == 'success') {
					const data = res.data
					this.memberDataToday = data.day_count_user || 0
					this.memberData[0].data = data.today_count_user
					this.memberData[1].data = data.count_source
					this.memberData[2].data = data.today_count_browse
					this.memberData[3].data = data.count_browse
					console.log(data)
				} else {
					uni.showToast(res.message)
				}
			})
		},
		// 最近更新
		// 获取线索跟踪中心
		_getStatsReport(id) {
			const params = {
				owner_user_id: this.userInfo.user_id
			}
			getStatsReport(params).then(res => {
				if (res.status === 'success') {
					const data = res.data
					const timestamp = getTimestamp() / 1000
					const report_data = data.userTrace.data

					for (const i in report_data) {
						const hourNum = Math.floor((timestamp - report_data[i].view_time_last) / 24 / 60)
						if (hourNum > 24) {
							report_data[i].day = `${parseInt(hourNum / 60)}天`
						} else {
							report_data[i].day = `${hourNum}小时`
						}
					}
					this.statsReport = report_data
					// setTimeout(() => {
					//     this.scroll_option.singleHeight = 70
					// }, 2000)
				} else {
					uni.showToast(res.errors.message)
				}
			})
		},
		// 更新通知提醒
		toolInfoFn(type) {
			let params = {
				type: type
			}
			updateToolInfo(params)
			let url = type == 1 ? '/pages/order/subscribeOrder' : '/pages/getGuest/myTask'
			this.toPageUrlFn(url)
		},
		/**
			 * 功能按钮跳转相应的页面
			 * @parmas item.type 1 为自身的跳转，2为商城的跳转, 3为商城带id的跳转
			 */
		jumpMenuFn(item) {
			// uni.navigateTo({
			// 	url: `/pages/page/login/index`
			// })
			// return false
			if (item.funtion) {
				item.funtion()
			}

			// if (item.type == 2) {
			// 	jumpShop(item.url, this.userInfo.user_picture)
			// 	return false
			// }
			// if (item.type == 3) {
			// 	jumpShop(item.url + this.userInfo.user_id, this.userInfo.user_picture)
			// 	return false
			// }
			if (item.url) {
				uni.navigateTo({
					url: `${item.url}?owner_user_id=${this.userInfo.user_id}`
					// url: `/pages/page/webview/index?user_id=${this.userInfo.user_id}&returnUrl=${encodeURIComponent(`${this.constant.formal}/hkds/#${returnUrl}`)}`
				})
				// this.$router.push({
				// 	name: item.url,
				// 	query: {
				// 		owner_user_id: this.userInfo.user_id
				// 	}
				// })
			}
		},
		/**
			 * 跳转到最近更新详情
			 * @parmas path 路由名字
			 * @parmas id 详情页面的关联id
			 * @parmas iden 详情页面的 id 字段标识
			 * @parmas gobackt 详情页面的 gobackt 标识
			 */
		jumpNewestDetFn(path, id, iden, gobackt) {
			const query = {
				owner_user_id: this.userInfo.user_id,
				gobackt,
				mainId: id
			}
			query[iden] = iden == 'poster_id' ? id : 'null'
			uni.navigateTo({
				url: `${path}?${qs.stringify(query)}`
			})
		},
		// 推给团队
		pushIteam(val) {
			uni.navigateTo({
				url: `/pages/getGuest/pushTeam?${qs.stringify(val)}`
			})
		},
		// 朋友圈推广
		toMaterialList(data, type) {
			const params = {
				case_article_id: type === 2 ? data.case_id : data.article_id,
				resource_type: type === 2 ? 2 : 1,
				relevance_id: type === 2 ? data.case_relevance_id : data.article_relevance_id,
				title: type === 2 ? data.case_name : data.title,
				imgUrl: type === 2 ? data.image_url : data.cover_img,
				extension_num: data.extension_num,
				huoke_num: data.huoke_num,
				cat_name: type === 2 ? '' : data.cat_name,
				from: 'index'
			}
			uni.navigateTo({
				url: `/pages/getGuest/shareList?${qs.stringify(params)}`
			})
		},
		// 客户数据详情
		memberDetBtn() {
			// const returnUrl = `/admin/guest/data${this.commonJS.queryData({
			// 	owner_user_id: this.userInfo.user_id,
			// 	type: 'hkds_miniapp',
			// 	token: uni.getStorageSync('token')
			// })}`
			// uni.navigateTo({
			// 	url: `/pages/page/webview/index?returnUrl=${encodeURIComponent(`${this.$constant.formal}/hkds/#${returnUrl}`)}`
			// })
			uni.navigateTo({
				url: `/pages/getGuest/memberData?owner_user_id=${this.userInfo.user_id}`
			})
		},
		// 推广获客
		shareGuest(type, id) {
			this.btnType = type
			setTimeout(() => {
				let data = {
					id: id
				}
				this.$refs.sharePoster.showMask(data, true)
			}, 50)
		},
		/**
			 * 跳转到路由相应得页面
			 * @parmas name 为跳转的页面路径
			 * @parmas type = 2 为跳转的webview页面
			 */
		toPageUrlFn(name, type) {
			if (type == 2) {
				const returnUrl = `/admin/guest/data${this.commonJS.queryData({
					owner_user_id: this.userInfo.user_id,
					type: 'hkds_miniapp',
					token: uni.getStorageSync('token')
				})}`
				uni.navigateTo({
					url: `/pages/page/webview/index?returnUrl=${encodeURIComponent(`${this.$constant.formal}/hkds/#${returnUrl}`)}`
				})
			} else {
				uni.navigateTo({
					url: `${name}?owner_user_id=${this.userInfo.user_id}`
				})
			}
		},
		// 长按获客海报
		touchStart(id) {
			console.log(id)
			clearTimeout(this.Loop) // 再次清空定时器，防止重复注册定时器
			this.Loop = setTimeout(() => {
				this.$router.push({
					name: 'OnlineDetail',
					query: {
						poster_id: id,
						owner_user_id: this.$route.query.owner_user_id
					}
				})
			}, 100)
		},
		touchEnd() {
			clearTimeout(this.Loop)
		},
		// 生成二维码
		showStoreQrCode() {
			this.$refs.appStoreQrCode.showMask()
		},
		updateUserInfo() {
			uni.showLoading({
				title: '修改成功...'
			})
			// getBasicUser(this.owner_user_id, true);
			getUser(true).then((res) => {
				this.$refs.inputCompany.closePopup()
				uni.hideLoading()
			})
		},
		// 微信分享
		onShareAppMessage: function(options) {
			const shareObj = {
				title: this.userInfo.nick_name + this.userInfo.role_name,
				path: this.minAppIndexUrl,
				imageUrl: this.storeQrCode
			}
			return shareObj
		}
	}
}
</script>

<style lang="scss" scoped>
	#getGuest {
		padding: 1px 0 120px;
		background-color: #f5f5f5;
		.wrap_tit_top {
			// padding-top: 38px;
			background-color: #fff;
			.home_preview {
				margin: 0 30px 0;
			}
			.home_btn_block {
				@include direction(center, space-between);
				color: $fontColor3;
				height: 100%;
				padding:30px;
				border-bottom: 0.5px solid #f5f5f5;
				.home_btn_left {
					@include disFlexCen();
				}
				.home_btn_right {
					width: 186px;
					img {
						height: 60%;
					}
				}
				.home_user_attr {
					width: 80px;
					height: 80px;
					border-radius: 50%;
					margin-right: 16px;
				}
				.home_user_name {
					font-size: 28px;
					font-weight: 600;
					color: #333;
				}
			}
			.remind_block {
				width: 140px;
				margin: 20px 0;
			}
			.remind_list {
				@include direction(center, space-between);
				color: $fontColor2;
				background-color: #f2f4f6;
				margin-bottom: 10px;
				height: 80px;
				padding: 0 12px;
				border-radius: 10px;
				.remind_list_left {
					@include disFlexCen();
					img {
						width: 40px;
						margin-right: 4px;
					}
				}
				.message_num {
					// @include disFlexCen();
					display: inline-block;
					padding: 0 4px;
					color: #fff;
					background-color: #ff2020;
					min-width: 30px;
					height: 30px;
					line-height: 30px;
					text-align: center;
					margin: 0 4px;
					// border-radius: 50%;
					border-top-left-radius: 50px;
					border-top-right-radius: 50px;
					border-bottom-left-radius: 50px;
					border-bottom-right-radius: 50px;
				}
			}
			.remind_list:last-child {
				margin-bottom: 20px;
			}
		}
		// 按钮快
		.menu_btn_wrap {
			border-top: 20px solid #f5f5f5;
			.menu_title {
				margin: 34px 32px;
				font-size: 28px;
				font-weight: 600;
			}
			.menu_list_blo {
				display: flex;
				align-items: center;
				flex-wrap: wrap;
				.menu_list {
					width: 25%;
					text-align: center;
					margin-bottom: 54px;
					color: $fontColor2;
					.menu_list_img {
						width: 60px;
						margin: 0 auto;
						img {
							height: auto;
						}
					}
					.menu_txt {
						margin-top: 8px;
						font-size: 24px;
					}
				}
			}
		}
		// 推广助手
		.assistant_wrap {
			border-top: 20px solid #f5f5f5;
			border-bottom: 20px solid #f5f5f5;
			padding: 0 30px;
			.assistant_title {
				margin: 34px 0;
				font-size: 28px;
				font-weight: 600;
			}
			.assistant_blo {
				@include direction(flex-start, space-between);
				.assistant_blo_left {
					width: 200px;
					.qrCode_blo {
						width: 200px;
						border: 0.5px solid #f5f5f5; /*no*/
						border-radius: 6px;
						.qrCode_img {
							width: 200px;
							height: 200px;
						}
					}
					.qrCode_link {
						text-align: center;
						margin-top: 20px;
						color: $auxiliaryColor2;
						font-size: 28px;
					}
				}
				.assistant_blo_right {
					width: calc(100% - 230px);
					@include direction(center, space-between);
					flex-wrap: wrap;
					padding-bottom: 30px;
					.assistant_btn_blo {
						position: relative;
						@include direction(flex-start, space-between);
						width: calc(50% - 26px);
						height: 114px;
						margin-left: 10px;
						margin-bottom: 10px;
						padding-top: 10px;
						padding-left: 10px;
						border: 0.5px solid #f5f5f5; /*no*/
						border-radius: 10px;
						color: $fontColor3;
						.assistant_btn_right {
							width: 82px;
							position: absolute;
							bottom: 0;
							right: 0;
							img {
								display: block;
								height: auto;
							}
						}
						.assistant_btn_tit {
							color: #333;
							font-size: 26px;
							font-weight: 600;
							margin-bottom: 6px;
						}
					}
				}
			}
		}
		// 数据统计
		.statistics_wrap {
			margin: 0 30px;
			padding: 40px 0;
			.assistant_title {
				font-size: 28px;
				font-weight: 600;
				@include direction(center, space-between);
				.assistant_title_right {
					color: $fontColor2;
					@include disFlexCen();
					font-weight: 400;
					font-size: 26px;
					// width: 46%;
					& > div {
						@include disFlexCen();
						margin-left: 38px;
						img {
							width: 30px;
						}
					}
				}
			}
			.statistics_blo {
				@include direction(center, space-between);
				margin: 40px 0 50px 0;
				color: $fontColor3;
				.member_data_tit {
					color: $fontColor2;
					margin-right: 10px;
				}
				.text_main_color {
					margin: 0 6px;
				}
			}
			.statistics_total {
				@include disFlexCen();
				color: $fontColor2;
				margin: 0 -30px;
				.statistics_list {
					width: 25%;
					text-align: center;
				}
			}
			.statistics_num {
				font-weight: 600;
				font-size: 32px;
				margin-bottom: 20px;
			}
		}
	}
</style>